@charset "utf-8";
@import "reset";
$fontsize:40;
@function r($px) {
    @return $px/$fontsize * 1rem
}

* {
    margin: 0;
    padding: 0;
    list-style: none;
}

html,
body {
    width: 100%;
    height: 100%;
}

.web {
    width: 100%;
    height: 100%;
    position: relative;
    >header {
        width: 100%;
        height: r(87);
        position: absolute;
        top: 0;
        background: #f7f7f7;
        margin: 0 auto;
        border-bottom: r(1) solid #c1c1c1;
        padding-left: r(20);
        .img{
            float: left;
            margin-top: r(20);
            width: r(22);
            height: r(37);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .nav {
            width: r(400);
            height: r(60);
            line-height: r(56);
            border: r(2) solid #d62d31;
            border-radius: r(6);
            margin: 0 auto;
            font-size: 0;
            position: absolute;
            top: r(13);
            left: r(120);
            span {
                display: inline-block;
                width: r(130);
                height: r(57);
                text-align: center;
                border-right: r(2) solid #d62d31;
                a {
                    font-size: r(28);
                    color: #d62d31;
                }
            }
            span.active {
                background: #d62d31;
                a {
                    color: #ffffff;
                }
            }
            span:nth-child(2) {
                width: r(137);
            }
            span:nth-child(3) {
                width: r(129);
                border-right: 0;
            }
        }
    }
    section {
        width: 100%;
        position: absolute;
        top: r(87);
        bottom: 0;
        overflow-y: scroll;
        -webkit-overflow-scrolling: touch;
        .date {
            width: 100%;
            height: r(82);
            ul {
                li {
                    span {
                        display: inline-block;
                        width: r(106);
                        height: r(82);
                        line-height: r(82);
                        text-align: center;
                        margin-right: r(42);
                        font-size: r(26);
                    }
                    span.active{
                        color: #d62d31;
                        border-bottom: r(4) solid #d62d31;
                    }
                }
                li:first-child {
                    span {
                        margin-left: r(102);
                    }
                }
            }
        }
        .img {
            width: 100%;
            height: r(336);
            border-top: 1px solid #e3e3e3;
            border-bottom: 1px solid #e3e3e3;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .num {
            width: 100%;
            height: r(140);
            .point {
                display: inline-block;
                width: 50%;
                text-align: center;
                margin-top: r(36);
                h5 {
                    font-size: r(30);
                    color: #333333;
                }
                p {
                    font-size: r(20);
                    color: #999999;
                    position: relative;
                }
                p:after {
                    content: "";
                    position: absolute;
                    left: r(88);
                    bottom: r(7);
                    width: r(12);
                    height: r(12);
                    border-radius: 50%;
                    background: #cc3333;
                }
            }
            .right {
                p:after {
                    background: #00a0e3;
                }
            }
        }
        .hr1 {
            width: 100%;
            height: r(32);
            background: #f3f4f6;
            border-top: r(1) solid #c1c1c1;
            border-bottom: r(1) solid #c1c1c1;
        }
        .management{
            width: r(600);
            margin: 0 auto;
            height: r(94);
            line-height: r(94);
            p{
                font-size: r(26);
                color: #333333;
            }
            a{
                float: right;
                font-size: r(30);
                color: #a8a9ab;
            }
        }
        .m{
            width: 100%;
            border-bottom: r(1) solid #e1e2e4;
            p{
                padding-left: r(30);
            }
            a{
                display: inline-block;
                height: r(94);
                padding-right: r(20);
            }
        }
        .foot {
            width: 100%;
            margin: 0 auto;
            height: r(89);
            line-height: r(88);
            border-bottom: r(1) solid #e3e3e3;
            h6 {
                padding-left: r(20);
                font-size: r(28);
                color: #d62d31;
            }
            p {
                padding-right: r(20);
                font-size: r(22);
                color: #999999;
            }
        }
        .list {
            width: 100%;
            margin: 0 auto;
            tr {
                width: 100%;
                height: r(136);
                td {
                    padding-left: r(20);
                    width: r(50);
                    height: r(136);
                    font-size: r(28);
                    color: #666666;
                    overflow: hidden;
                    h6 {
                        margin-bottom: r(22);
                        a {
                            font-size: r(28);
                            color: #333333;
                        }
                    }
                    p {
                        font-size: r(24);
                        color: #999999;
                    }
                }
                td:last-child {
                    padding-left: 0;
                    width: r(570);
                    border-bottom: r(1) solid #e3e3e3;
                }
            }
            tr:last-child {
                td:last-child {
                    border-bottom: 0;
                }
            }
        }
        .hr {
            width: 100%;
            height: r(41);
            background: #f3f4f6;
            border-top: r(1) solid #e3e3e3;
        }
        .hr2{
            width: 100%;
            height: r(232);
            background: #f3f4f6;
            p{
                padding-top: r(34);
                padding-left: r(112);
                font-size: r(20);
                color: #999999;
            }
        }
    }
}